<template>
	<view class="goods_list">
		<goods-list :goods="goods" @goodsItemClick="goGoodsDetail"></goods-list>
		<view class="isOver" v-if="flag">没有啦</view>
	</view>
</template>

<script>
	import goodsList from '../../components/goods-list/goods-list.vue'
	export default {
		data() {
			return {
				goods:[],
				pageindex:1,
				flag: false,
				total:0
			}
		},
		onLoad() {
			this.getGoodsList()
		},
		onReachBottom() {
			if(this.pageindex>5) return this.flag=true
			this.pageindex++
			this.getGoodsList()
		},
		onPullDownRefresh() {
			this.pageindex = 1
			this.goods=[]
			this.flag=false
			setTimeout(()=>{
				this.getGoodsList(()=>uni.stopPullDownRefresh())
			},1000)
		},
		components: {"goods-list":goodsList},
		methods: {
			//获取商品列表的数据
			async getGoodsList(callBack){
				const res = await this.$myRequest({
					url:'/api/public/v1/goods/search?pagenum='+this.pageindex
				})
				this.total = res.message.total
				this.goods=[...this.goods, ...res.message.goods]
				callBack &&callBack()
				console.log(res)
			},
			//商品详情
			goGoodsDetail(id){
				uni.navigateTo({
					url:'../../pages/goods-detail/goods-detail?id='+id
				})
			}
		}
	}
</script>

<style lang="scss">
 .goods_list{
	 background-color: #eee;
 }
 .isOver {
	 width: 100%;
	 height: 50px;
	 line-height: 50px;
	 text-align: center;
	 font-size: 28rpx;
 }
</style>
